{{#ember-wormhole to="modal-wormhole"}}
  <div class="{{modalClass}} {{if isActive 'is-active'}}" aria-modal="true">
    <div class="modal-background" onclick={{onClose}} data-test-modal-background></div>
    <div class="modal-card">
        <header class="modal-card-head">
          <h2 class="modal-card-title title is-5" data-test-modal-title>
            {{#if glyph}}
              <Icon
                @size="l"
                class="{{glyph.glyphClass}}"
                aria-hidden="true"
                @glyph={{glyph.glyph}}
                data-test-modal-glyph={{glyph.glyph}}
              />
            {{/if}}
            <span>{{title}}</span>
          </h2>
          {{#if showCloseButton}}
            <button type="button" class="delete" aria-label="close" onclick={{onClose}} data-test-modal-close-button></button>
          {{/if}}
        </header>
      {{yield}}
    </div>
  </div>
{{/ember-wormhole}}
